import type { CommunityItem, CommentItem } from "@/types/web/community"

// Mock社区数据 - 参考article接口的数据结构
export const mockCommunityData = [
  {
    _id: "1",
    title: "Vue3 + TypeScript 项目最佳实践分享",
    description: "在使用Vue3和TypeScript开发项目的过程中，总结了一些最佳实践和常见问题的解决方案，希望能帮助到大家。",
    content: `
      <h2>前言</h2>
      <p>Vue3 正式发布已经有一段时间了，配合TypeScript可以让我们的代码更加健壮和可维护。</p>

      <h2>组合式API的使用</h2>
      <p>使用组合式API可以更好地组织和复用逻辑代码...</p>

      <h3>1. ref vs reactive</h3>
      <p>ref适用于基本类型，reactive适用于引用类型。</p>

      <h3>2. 类型定义</h3>
      <p>正确地定义类型可以让IDE提供更好的代码提示...</p>

      <h2>总结</h2>
      <p>Vue3 + TypeScript的组合让前端开发更加工程化和规范化。</p>
    `,
    cover: "https://picsum.photos/400/300?random=1",
    category: "技术分享",
    tags: ["Vue3", "TypeScript", "前端开发"],
    author: {
      _id: "user1",
      nickname: "前端小白",
      avatar: "https://i.pravatar.cc/150?img=1"
    },
    views: 1250,
    likes: 89,
    comments: 23,
    status: 1,
    createdAt: "2025-01-15T10:30:00.000Z",
    updatedAt: "2025-01-15T10:30:00.000Z"
  },
  {
    _id: "2",
    title: "如何优化前端性能？10个实用技巧",
    description: "前端性能优化是每个开发者都需要掌握的技能。本文总结了10个实用的前端性能优化技巧，帮助你提升网站速度。",
    content: `
      <h2>1. 图片优化</h2>
      <p>使用WebP格式，懒加载，合理设置图片尺寸...</p>

      <h2>2. 代码分割</h2>
      <p>使用动态import进行路由级别的代码分割...</p>

      <h2>3. 缓存策略</h2>
      <p>合理使用浏览器缓存，减少重复请求...</p>
    `,
    cover: "https://picsum.photos/400/300?random=2",
    category: "性能优化",
    tags: ["性能优化", "Web开发"],
    author: {
      _id: "user2",
      nickname: "性能优化专家",
      avatar: "https://i.pravatar.cc/150?img=2"
    },
    views: 2340,
    likes: 156,
    comments: 45,
    status: 1,
    createdAt: "2025-01-18T14:20:00.000Z",
    updatedAt: "2025-01-18T14:20:00.000Z"
  },
  {
    _id: "3",
    title: "CSS Grid 布局完全指南",
    description: "CSS Grid是现代Web布局的强大工具。本文详细介绍了Grid布局的各种用法和实战技巧。",
    content: `
      <h2>什么是CSS Grid？</h2>
      <p>CSS Grid是一个二维布局系统，可以同时处理行和列...</p>

      <h2>基础概念</h2>
      <ul>
        <li>Grid Container</li>
        <li>Grid Item</li>
        <li>Grid Line</li>
        <li>Grid Track</li>
      </ul>

      <h2>实战案例</h2>
      <p>让我们通过几个实际案例来学习Grid布局...</p>
    `,
    cover: "https://picsum.photos/400/300?random=3",
    category: "CSS技巧",
    tags: ["CSS", "布局", "Grid"],
    author: {
      _id: "user3",
      nickname: "CSS大师",
      avatar: "https://i.pravatar.cc/150?img=3"
    },
    views: 890,
    likes: 67,
    comments: 12,
    status: 1,
    createdAt: "2025-01-20T09:15:00.000Z",
    updatedAt: "2025-01-20T09:15:00.000Z"
  },
  {
    _id: "4",
    title: "React Hooks 深入理解",
    description: "深入探讨React Hooks的原理和使用场景，包括useState、useEffect、useCallback等常用Hooks。",
    content: `
      <h2>Hooks的诞生背景</h2>
      <p>在Hooks出现之前，函数组件无法使用状态和生命周期...</p>

      <h2>useState详解</h2>
      <p>useState是最基础的Hook，用于在函数组件中添加状态...</p>

      <h2>useEffect详解</h2>
      <p>useEffect用于处理副作用，如数据获取、订阅等...</p>
    `,
    cover: "https://picsum.photos/400/300?random=4",
    category: "React",
    tags: ["React", "Hooks", "前端框架"],
    author: {
      _id: "user4",
      nickname: "React爱好者",
      avatar: "https://i.pravatar.cc/150?img=4"
    },
    views: 1560,
    likes: 98,
    comments: 31,
    status: 1,
    createdAt: "2025-01-22T16:45:00.000Z",
    updatedAt: "2025-01-22T16:45:00.000Z"
  },
  {
    _id: "5",
    title: "JavaScript异步编程完全指南",
    description: "从回调函数到Promise，再到async/await，全面讲解JavaScript异步编程的演进历程。",
    content: `
      <h2>回调函数时代</h2>
      <p>最早的异步解决方案是回调函数，但容易陷入回调地狱...</p>

      <h2>Promise的出现</h2>
      <p>Promise提供了更优雅的异步解决方案...</p>

      <h2>async/await语法糖</h2>
      <p>async/await让异步代码看起来像同步代码...</p>
    `,
    cover: "https://picsum.photos/400/300?random=5",
    category: "JavaScript",
    tags: ["JavaScript", "异步编程", "Promise"],
    author: {
      _id: "user5",
      nickname: "JS忍者",
      avatar: "https://i.pravatar.cc/150?img=5"
    },
    views: 1820,
    likes: 134,
    comments: 28,
    status: 1,
    createdAt: "2025-01-19T11:30:00.000Z",
    updatedAt: "2025-01-19T11:30:00.000Z"
  },
  {
    _id: "6",
    title: "Node.js微服务架构实践",
    description: "基于Node.js构建微服务架构的实战经验分享，包括服务拆分、服务通信、服务治理等内容。",
    content: `
      <h2>什么是微服务</h2>
      <p>微服务是一种架构风格，将应用拆分成多个小型服务...</p>

      <h2>服务拆分原则</h2>
      <p>如何合理地拆分服务是微服务架构的关键...</p>

      <h2>服务间通信</h2>
      <p>常见的通信方式有REST、gRPC、消息队列等...</p>
    `,
    cover: "https://picsum.photos/400/300?random=6",
    category: "后端开发",
    tags: ["Node.js", "微服务", "架构"],
    author: {
      _id: "user6",
      nickname: "后端架构师",
      avatar: "https://i.pravatar.cc/150?img=6"
    },
    views: 2100,
    likes: 178,
    comments: 52,
    status: 1,
    createdAt: "2025-01-16T13:20:00.000Z",
    updatedAt: "2025-01-16T13:20:00.000Z"
  },
  {
    _id: "7",
    title: "Webpack5从入门到精通",
    description: "详细讲解Webpack5的核心概念、配置方法和优化技巧，帮助你构建高效的前端工程化项目。",
    content: `
      <h2>Webpack基础概念</h2>
      <p>Entry、Output、Loader、Plugin是Webpack的四大核心概念...</p>

      <h2>常用Loader配置</h2>
      <p>babel-loader、css-loader、file-loader等常用loader的配置...</p>

      <h2>性能优化</h2>
      <p>代码分割、Tree Shaking、持久化缓存等优化技巧...</p>
    `,
    cover: "https://picsum.photos/400/300?random=7",
    category: "工程化",
    tags: ["Webpack", "构建工具", "前端工程化"],
    author: {
      _id: "user7",
      nickname: "工程化专家",
      avatar: "https://i.pravatar.cc/150?img=7"
    },
    views: 1450,
    likes: 102,
    comments: 19,
    status: 1,
    createdAt: "2025-01-21T15:10:00.000Z",
    updatedAt: "2025-01-21T15:10:00.000Z"
  },
  {
    _id: "8",
    title: "设计模式在前端开发中的应用",
    description: "介绍常见的设计模式如何在前端开发中应用，包括单例模式、观察者模式、工厂模式等。",
    content: `
      <h2>为什么要学习设计模式</h2>
      <p>设计模式是解决常见问题的最佳实践...</p>

      <h2>单例模式</h2>
      <p>确保一个类只有一个实例，常用于全局状态管理...</p>

      <h2>观察者模式</h2>
      <p>实现对象间的松耦合，Vue的响应式系统就是观察者模式...</p>
    `,
    cover: "https://picsum.photos/400/300?random=8",
    category: "设计模式",
    tags: ["设计模式", "架构", "最佳实践"],
    author: {
      _id: "user8",
      nickname: "代码艺术家",
      avatar: "https://i.pravatar.cc/150?img=8"
    },
    views: 1120,
    likes: 84,
    comments: 16,
    status: 1,
    createdAt: "2025-01-17T10:05:00.000Z",
    updatedAt: "2025-01-17T10:05:00.000Z"
  }
]

// Mock评论数据（支持回复结构）
export const mockCommentsData: Record<string, any[]> = {
  "1": [
    {
      _id: "c1",
      content: "写得非常好！特别是关于组合式API的部分，讲解得很透彻。我在项目中使用Vue3+TS已经半年了，确实感受到了类型安全带来的好处。不过有个问题想请教一下，在处理复杂的嵌套响应式对象时，用ref还是reactive更好？",
      author: "前端架构师张三",
      avatar: "https://i.pravatar.cc/150?img=11",
      location: "北京",
      likes: 45,
      createdAt: "2025-01-15T08:30:00.000Z",
      replies: [
        {
          _id: "r1-1",
          content: "感谢认可！关于你的问题，我的建议是：如果是深层嵌套的对象，用reactive会更方便，可以直接解构；如果需要整体替换，用ref会更合适。具体要看业务场景。",
          author: "前端小白",
          avatar: "https://i.pravatar.cc/150?img=1",
          location: "上海",
          likes: 28,
          replyTo: {
            _id: "c1",
            nickname: "前端架构师张三"
          },
          createdAt: "2025-01-15T09:15:00.000Z"
        },
        {
          _id: "r1-2",
          content: "我一般嵌套对象用reactive，基本类型用ref，这样比较清晰。",
          author: "Vue技术专家",
          avatar: "https://i.pravatar.cc/150?img=21",
          location: "深圳",
          likes: 18,
          replyTo: {
            _id: "c1",
            nickname: "前端架构师张三"
          },
          createdAt: "2025-01-15T09:45:00.000Z"
        },
        {
          _id: "r1-3",
          content: "补充一下，如果对象需要整体重新赋值的话，ref会更好，因为reactive整体赋值会丢失响应式。",
          author: "尤雨溪学徒",
          avatar: "https://i.pravatar.cc/150?img=23",
          location: "杭州",
          likes: 32,
          replyTo: {
            _id: "r1-1",
            nickname: "前端小白"
          },
          createdAt: "2025-01-15T10:20:00.000Z"
        },
        {
          _id: "r1-4",
          content: "对的！我踩过这个坑，reactive重新赋值确实会失去响应式，最后改用ref包裹对象了。",
          author: "踩坑小能手",
          avatar: "https://i.pravatar.cc/150?img=24",
          location: "成都",
          likes: 15,
          replyTo: {
            _id: "r1-3",
            nickname: "尤雨溪学徒"
          },
          createdAt: "2025-01-15T11:00:00.000Z"
        },
        {
          _id: "r1-5",
          content: "学到了！这个区别很重要，之前一直搞不清楚。",
          author: "前端新手小李",
          avatar: "https://i.pravatar.cc/150?img=25",
          location: "武汉",
          likes: 9,
          replyTo: {
            _id: "r1-3",
            nickname: "尤雨溪学徒"
          },
          createdAt: "2025-01-15T11:30:00.000Z"
        },
        {
          _id: "r1-6",
          content: "加油！多实践就会理解了，我当初也是这样过来的。推荐看Vue3官方文档的响应式原理部分。",
          author: "热心老司机",
          avatar: "https://i.pravatar.cc/150?img=37",
          location: "杭州",
          likes: 7,
          replyTo: {
            _id: "r1-5",
            nickname: "前端新手小李"
          },
          createdAt: "2025-01-15T12:00:00.000Z"
        },
        {
          _id: "r1-7",
          content: "同为新手，建议配合TypeScript一起学，类型提示能帮助理解很多概念。",
          author: "一起进步的萌新",
          avatar: "https://i.pravatar.cc/150?img=38",
          location: "西安",
          likes: 11,
          replyTo: {
            _id: "r1-5",
            nickname: "前端新手小李"
          },
          createdAt: "2025-01-15T12:15:00.000Z"
        }
      ]
    },
    {
      _id: "c2",
      content: "TypeScript的类型定义确实是个大学问。能不能详细讲讲泛型在Vue3中的应用？特别是defineProps和defineEmits的类型定义，我总是写得不够优雅。",
      author: "TS困惑者王五",
      avatar: "https://i.pravatar.cc/150?img=12",
      location: "杭州",
      likes: 38,
      createdAt: "2025-01-15T09:15:00.000Z",
      replies: [
        {
          _id: "r2-1",
          content: "可以用withDefaults配合defineProps<Props>()，类型推导会很准确。比如：withDefaults(defineProps<{name: string, age?: number}>(), {age: 18})",
          author: "TypeScript大佬",
          avatar: "https://i.pravatar.cc/150?img=22",
          location: "上海",
          likes: 42,
          replyTo: {
            _id: "c2",
            nickname: "TS困惑者王五"
          },
          createdAt: "2025-01-15T10:00:00.000Z"
        },
        {
          _id: "r2-2",
          content: "defineEmits也是，用泛型写法更清晰：defineEmits<{(e: 'update', value: string): void, (e: 'delete', id: number): void}>()，这样IDE提示特别好用！",
          author: "类型体操选手",
          avatar: "https://i.pravatar.cc/150?img=26",
          location: "北京",
          likes: 35,
          replyTo: {
            _id: "c2",
            nickname: "TS困惑者王五"
          },
          createdAt: "2025-01-15T10:30:00.000Z"
        },
        {
          _id: "r2-3",
          content: "哇，这个写法太优雅了！比我之前的运行时props好太多。谢谢大佬！",
          author: "TS困惑者王五",
          avatar: "https://i.pravatar.cc/150?img=12",
          location: "杭州",
          likes: 12,
          replyTo: {
            _id: "r2-1",
            nickname: "TypeScript大佬"
          },
          createdAt: "2025-01-15T11:15:00.000Z"
        },
        {
          _id: "r2-4",
          content: "建议看看Vue官方的类型挑战项目，里面有很多实用的类型定义技巧。",
          author: "学习资源分享者",
          avatar: "https://i.pravatar.cc/150?img=27",
          location: "深圳",
          likes: 20,
          replyTo: {
            _id: "c2",
            nickname: "TS困惑者王五"
          },
          createdAt: "2025-01-15T12:00:00.000Z"
        }
      ]
    },
    {
      _id: "c3",
      content: "文章质量很高！不过有一点小建议，能否补充一下Pinia的TypeScript使用方式？现在大家基本都用Pinia替代Vuex了。",
      author: "状态管理爱好者",
      avatar: "https://i.pravatar.cc/150?img=13",
      location: "广州",
      likes: 52,
      createdAt: "2025-01-15T10:20:00.000Z",
      replies: [
        {
          _id: "r3-1",
          content: "好建议！我后续会单独写一篇Pinia+TS的最佳实践，包括store的类型定义、getters的类型推导、actions的类型安全等。",
          author: "前端小白",
          avatar: "https://i.pravatar.cc/150?img=1",
          location: "上海",
          likes: 38,
          replyTo: {
            _id: "c3",
            nickname: "状态管理爱好者"
          },
          createdAt: "2025-01-15T11:00:00.000Z"
        },
        {
          _id: "r3-2",
          content: "期待！Pinia的类型推导确实很强大，但是有些高级用法还是容易踩坑。",
          author: "Pinia使用者",
          avatar: "https://i.pravatar.cc/150?img=28",
          location: "成都",
          likes: 15,
          replyTo: {
            _id: "r3-1",
            nickname: "前端小白"
          },
          createdAt: "2025-01-15T11:45:00.000Z"
        },
        {
          _id: "r3-3",
          content: "已关注，坐等更新！顺便问下，你们项目中Pinia的store是按模块划分还是按功能划分的？",
          author: "架构设计师",
          avatar: "https://i.pravatar.cc/150?img=29",
          location: "南京",
          likes: 22,
          replyTo: {
            _id: "r3-1",
            nickname: "前端小白"
          },
          createdAt: "2025-01-15T12:30:00.000Z"
        }
      ]
    },
    {
      _id: "c4",
      content: "请问在大型项目中，如何优雅地处理API接口的类型定义？是手动写还是用工具生成？我们团队现在接口特别多，维护类型定义很头疼。",
      author: "大型项目负责人",
      avatar: "https://i.pravatar.cc/150?img=14",
      location: "北京",
      likes: 67,
      createdAt: "2025-01-15T11:00:00.000Z",
      replies: [
        {
          _id: "r4-1",
          content: "强烈推荐用openapi-typescript或swagger-typescript-api自动生成！我们300+接口全自动生成，省了太多时间。",
          author: "工程化专家",
          avatar: "https://i.pravatar.cc/150?img=30",
          location: "深圳",
          likes: 88,
          replyTo: {
            _id: "c4",
            nickname: "大型项目负责人"
          },
          createdAt: "2025-01-15T11:30:00.000Z"
        },
        {
          _id: "r4-2",
          content: "我们用的是后端提供的Swagger文档生成，配合CI/CD自动更新类型文件，体验非常好。",
          author: "DevOps工程师",
          avatar: "https://i.pravatar.cc/150?img=31",
          location: "杭州",
          likes: 56,
          replyTo: {
            _id: "r4-1",
            nickname: "工程化专家"
          },
          createdAt: "2025-01-15T12:00:00.000Z"
        },
        {
          _id: "r4-3",
          content: "能分享一下具体的配置吗？我们也想接入自动生成。",
          author: "大型项目负责人",
          avatar: "https://i.pravatar.cc/150?img=14",
          location: "北京",
          likes: 30,
          replyTo: {
            _id: "r4-1",
            nickname: "工程化专家"
          },
          createdAt: "2025-01-15T12:45:00.000Z"
        },
        {
          _id: "r4-4",
          content: "我写个详细教程发GitHub，到时候贴链接。",
          author: "工程化专家",
          avatar: "https://i.pravatar.cc/150?img=30",
          location: "深圳",
          likes: 72,
          replyTo: {
            _id: "r4-3",
            nickname: "大型项目负责人"
          },
          createdAt: "2025-01-15T13:15:00.000Z"
        },
        {
          _id: "r4-5",
          content: "mark！期待教程！",
          author: "收藏夹吃灰选手",
          avatar: "https://i.pravatar.cc/150?img=32",
          location: "武汉",
          likes: 18,
          replyTo: {
            _id: "r4-4",
            nickname: "工程化专家"
          },
          createdAt: "2025-01-15T13:45:00.000Z"
        }
      ]
    },
    {
      _id: "c5",
      content: "作为一个从Vue2过来的老开发者，看了这篇文章对Vue3+TS更有信心了。不过setup语法糖和传统Options API相比，在团队协作时有什么需要注意的吗？",
      author: "Vue2老兵",
      avatar: "https://i.pravatar.cc/150?img=15",
      location: "上海",
      likes: 29,
      createdAt: "2025-01-15T12:00:00.000Z",
      replies: [
        {
          _id: "r5-1",
          content: "主要是要统一代码风格，建议用ESLint强制要求setup语法糖，不要混用。另外composables的命名和目录结构要规范。",
          author: "团队Leader",
          avatar: "https://i.pravatar.cc/150?img=33",
          location: "北京",
          likes: 24,
          replyTo: {
            _id: "c5",
            nickname: "Vue2老兵"
          },
          createdAt: "2025-01-15T12:30:00.000Z"
        },
        {
          _id: "r5-2",
          content: "还要注意this的使用，很多Vue2的老代码习惯要改掉。我们团队就出现过这个问题。",
          author: "代码审查员",
          avatar: "https://i.pravatar.cc/150?img=34",
          location: "深圳",
          likes: 16,
          replyTo: {
            _id: "c5",
            nickname: "Vue2老兵"
          },
          createdAt: "2025-01-15T13:00:00.000Z"
        }
      ]
    },
    {
      _id: "c6",
      content: "收藏了！准备周末仔细研读。顺便问一下，Vue3的性能相比Vue2提升有多少？有实际的benchmark数据吗？",
      author: "性能优化狂魔",
      avatar: "https://i.pravatar.cc/150?img=16",
      location: "杭州",
      likes: 19,
      createdAt: "2025-01-15T13:00:00.000Z",
      replies: [
        {
          _id: "r6-1",
          content: "根据官方数据，内存使用减少了54%，初始渲染快55%，更新快133%。实际项目中确实能感觉到快很多。",
          author: "性能测试工程师",
          avatar: "https://i.pravatar.cc/150?img=35",
          location: "北京",
          likes: 41,
          replyTo: {
            _id: "c6",
            nickname: "性能优化狂魔"
          },
          createdAt: "2025-01-15T13:30:00.000Z"
        },
        {
          _id: "r6-2",
          content: "我们从Vue2迁移到Vue3后，首屏加载时间从3.2s降到1.8s，效果明显！",
          author: "项目迁移者",
          avatar: "https://i.pravatar.cc/150?img=36",
          location: "广州",
          likes: 33,
          replyTo: {
            _id: "r6-1",
            nickname: "性能测试工程师"
          },
          createdAt: "2025-01-15T14:00:00.000Z"
        }
      ]
    },
    {
      _id: "c7",
      content: "非常实用的文章！已经分享给团队了。期待后续更多Vue3的进阶内容，比如自定义指令、插件开发等。",
      author: "技术分享达人",
      avatar: "https://i.pravatar.cc/150?img=17",
      location: "成都",
      likes: 35,
      createdAt: "2025-01-15T14:00:00.000Z",
      replies: [
        {
          _id: "r7-1",
          content: "感谢支持！这些内容我都在计划中，争取这个月内更新。",
          author: "前端小白",
          avatar: "https://i.pravatar.cc/150?img=1",
          location: "上海",
          likes: 22,
          replyTo: {
            _id: "c7",
            nickname: "技术分享达人"
          },
          createdAt: "2025-01-15T14:30:00.000Z"
        }
      ]
    }
  ],
  "2": [
    {
      _id: "c4",
      content: "这些优化技巧都很实用，特别是图片优化那部分。",
      author: "开发者D",
      avatar: "https://i.pravatar.cc/150?img=14",
      location: "深圳",
      likes: 15,
      createdAt: "2025-01-18T15:00:00.000Z",
      replies: []
    },
    {
      _id: "c5",
      content: "代码分割确实能显著提升首屏加载速度！",
      author: "开发者E",
      avatar: "https://i.pravatar.cc/150?img=15",
      location: "武汉",
      likes: 9,
      createdAt: "2025-01-18T16:30:00.000Z",
      replies: []
    }
  ],
  "3": [
    {
      _id: "c6",
      content: "Grid布局太强大了，比Flexbox更适合复杂布局。",
      author: "前端F",
      avatar: "https://i.pravatar.cc/150?img=16",
      location: "成都",
      likes: 7,
      createdAt: "2025-01-20T10:00:00.000Z",
      replies: []
    }
  ],
  "4": [
    {
      _id: "c7",
      content: "Hooks让函数组件更加强大，不过也要注意闭包问题。",
      author: "React开发者G",
      avatar: "https://i.pravatar.cc/150?img=17",
      location: "南京",
      likes: 11,
      createdAt: "2025-01-22T17:30:00.000Z",
      replies: []
    },
    {
      _id: "c8",
      content: "useCallback和useMemo的使用时机经常搞混，这篇文章讲得很清楚。",
      author: "开发者H",
      avatar: "https://i.pravatar.cc/150?img=18",
      location: "西安",
      likes: 6,
      createdAt: "2025-01-22T18:00:00.000Z",
      replies: []
    }
  ],
  "5": [
    {
      _id: "c9",
      content: "从回调到Promise再到async/await的演进过程写得很详细。",
      author: "学习者I",
      avatar: "https://i.pravatar.cc/150?img=19",
      location: "天津",
      likes: 10,
      createdAt: "2025-01-19T12:00:00.000Z",
      replies: []
    }
  ],
  "6": [
    {
      _id: "c10",
      content: "微服务架构的实践经验很宝贵，感谢分享！",
      author: "后端开发J",
      avatar: "https://i.pravatar.cc/150?img=20",
      location: "重庆",
      likes: 13,
      createdAt: "2025-01-16T14:30:00.000Z",
      replies: []
    }
  ],
  "7": [
    {
      _id: "c11",
      content: "Webpack配置一直是我的痛点，这篇文章解答了很多疑问。",
      author: "前端K",
      avatar: "https://i.pravatar.cc/150?img=21",
      location: "苏州",
      likes: 8,
      createdAt: "2025-01-21T16:00:00.000Z",
      replies: []
    }
  ],
  "8": [
    {
      _id: "c12",
      content: "设计模式在前端的应用讲得很透彻。",
      author: "架构师L",
      avatar: "https://i.pravatar.cc/150?img=22",
      location: "厦门",
      likes: 14,
      createdAt: "2025-01-17T11:00:00.000Z",
      replies: []
    }
  ]
}

// 模拟API延迟
export const mockDelay = (ms: number = 500) => {
  return new Promise(resolve => setTimeout(resolve, ms))
}

// 获取社区列表（模拟）
export const getMockCommunityList = async (page: number, pageSize: number) => {
  await mockDelay()
  const start = (page - 1) * pageSize
  const end = start + pageSize
  const data = mockCommunityData.slice(start, end)

  return {
    code: 200,
    message: "success",
    data,
    total: mockCommunityData.length
  }
}

// 获取社区详情（模拟）
export const getMockCommunityDetail = async (id: string) => {
  await mockDelay()
  const data = mockCommunityData.find(item => item._id === id)

  return {
    code: 200,
    message: "success",
    data: data || mockCommunityData[0]
  }
}

// 获取评论列表（模拟）
export const getMockComments = async (id: string, page: number, pageSize: number) => {
  await mockDelay()
  const comments = mockCommentsData[id] || []
  const start = (page - 1) * pageSize
  const end = start + pageSize
  const data = comments.slice(start, end)

  return {
    code: 200,
    message: "success",
    data,
    total: comments.length
  }
}

